<template>
	<view class="leave_box">
    <navTitle :title="'歷史面試'" :titleRight="''" :jumpUrl="jumpUrl"></navTitle>
    <scroll-view scroll-y class="scroll-list">
      <view class="row-interview" v-for="(item,index) in list" :key="index" @tap="companyDetail(item,index)">
        <view class="row-p">
          <view class="r-p-l">{{ item.interview_time_format|filterTime }}</view>
          <view class="r-p-r">{{ item.job.job_name }}/{{ item.job.salary_text }}</view>
        </view>
        <view class="card-interview">
          <view class="c-i-title">{{ item.enterpriseinfo.company_name }}</view>
          <view class="c-i-txt">
					  <img src="/static/images/user/icon_u_gray_location.png" mode="scaleToFill" alt="">
            <view>{{ item.address }}</view>
          </view>
        </view>
      </view>
    </scroll-view>
	</view>
</template>

<script>
import navTitle from '../../boss/components/nav-title.vue';
import { jobInterviewPersonalList } from '../../../utils/userApi'
export default {
	components: {navTitle},
	data() {
		return {
      jumpUrl:'/pages/boss/user/historyInterview',
      offset:1,
      limit:10,
      has_more:false,
      list:[],
		};
	},
	props: {
	},
	computed: {},
  filters:{
    filterTime(txt){
      let arr=txt.split(' ')
      let before=arr[0].split('-')
      let after=arr[1].split(':')
      return `${before[1]}月${before[2]}日${after[0]}:${after[1]}`
    }
  },
  onShow() {
    this.offset=1
    this.list=[]
    this.getList()
  },
  onPullDownRefresh() {
    this.offset=1
    this.list=[]
    this.getList()
	},
  onReachBottom() {
    if(this.has_more){
      this.getList()
    }else{
      uni.showToast({
        icon:'none',
        title: '沒有更多數據了'
      })
    }
  },
	methods: {
    companyDetail(item,index){
      uni.navigateTo({ url: '/pages/user/resume/interviewDetails?id='+item.id })
      uni.navigateTo({ url: `/pages/user/resume/interviewDetails?id=${item.id}&state=-1` })
    },
    async getList(){
      let res=await jobInterviewPersonalList({status:-2,offset:this.offset,limit:this.limit})
      if(res.code==1){
        this.list=this.list.concat(res.data.data)
        this.has_more=res.data.has_more
      }else{
        uni.showToast({
          icon:'none',
          title: res.msg||'系統異常'
        })
      }
    }
	}
};
</script>
<style lang="scss" scoped>
.leave_box{
  width: 100%;
  height: 100vh;
  overflow-y: scroll;
  background: #F4F6FA;
}
.row-interview{
  width: calc(100% - 20px);
  padding: 15px 0 0;
  margin: 0 auto 20px;
}
.row-p{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.r-p-l{
  flex: 1;
  font-weight: bold;
  font-size: 16px;
  color: #333333;
  line-height: 22px;
}
.r-p-r{
  flex: 1.3;
  font-family: LucidaGrande, LucidaGrande;
  font-weight: bold;
  font-size: 14px;
  color: #333333;
  line-height: 17px;
  text-align: right;
}
.card-interview{
  width: calc(100% - 16px);
  padding: 10px 0 10px 16px;
  background: #FFFFFF;
  border-radius: 2px 10px 10px 2px;
  position: relative;
  margin-top: 10px;
}
.card-interview::after{
  content: '';
  width: 4px;
  height: 100%;
  background-color: #D1D1D1;
  border-radius: 2px;
  position: absolute;
  top: 0;
  left: 0;
}
.c-i-title{
  font-weight: bold;
  font-size: 16px;
  color: #333333;
  line-height: 22px;
  margin: 0 0 8px 0;
}
.c-i-txt{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 14px;
  color: #666666;
  line-height: 23px;
  img{
    width: 14px;
    height: 16px;
    margin-right: 6px;
  }
}
</style>
